<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>文件上传与下载</title>
</head>
<body>
<h2>文件上传</h2>
<input type="file" id="fileInput" />
<button onclick="uploadFile()">上传</button>

<h2>文件下载</h2>
<button onclick="downloadFile()">下载</button>

<script>
    // 上传文件
    function uploadFile() {
        var fileInput = document.getElementById('fileInput');
        var file = fileInput.files[0];
        if (!file) {
            alert('请选择一个文件');
            return;
        }
        // 将文件转换为ArrayBuffer
        var reader = new FileReader();
        // 当文件读取完成后
        reader.onload = function(e) {
            var arrayBuffer = e.target.result;

            // 发送ArrayBuffer到后端
            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'http://127.0.0.1:8004/byte/upload', true);
            xhr.onload = function() {
                if (xhr.status === 200) {
                    alert('文件上传成功！');
                } else {
                    alert('文件上传失败！');
                }
            };
            xhr.send(arrayBuffer);
        };
        // 当文件读取错误时
        reader.onerror = function(err) {
            console.error('文件读取失败:', err);
        };
        // 开始读取文件
        reader.readAsArrayBuffer(file);
    }

    // 下载文件
    function downloadFile() {
        var xhr = new XMLHttpRequest();
        xhr.open('GET', 'http://127.0.0.1:8004/byte/download', true);
        xhr.responseType = 'arraybuffer'; // 设置响应类型为ArrayBuffer
        xhr.onload = function() {
            if (xhr.status === 200) {
                // 将ArrayBuffer转换为Blob
                var blob = new Blob([xhr.response], { type: 'application/octet-stream' });

                // 创建下载链接
                var link = document.createElement('a');
                link.href = window.URL.createObjectURL(blob);
                link.download = 'downloaded_file'; // 设置下载文件名
                link.click();

                alert('文件下载成功！');
            } else {
                alert('文件下载失败！');
            }
        };
        xhr.send();
    }
</script>
</body>
</html>